<template>
    <a-tabs :defaultActiveKey="0">
      <a-dropdown slot="tabBarExtraContent">
        <a-menu slot="overlay" >
          <template v-for="(chart,index) in group.charts">
            <a-menu-item @click="handleMenuClick(chart.head.code)" :key="index">{{chart.head.name}}</a-menu-item>
          </template>
        </a-menu>
        <a-button type="primary" size="small" class="ant-btn-background-ghost">详情<a-icon type="down"/></a-button>
      </a-dropdown>
      <template v-for="(chart,index2) in group.charts">
        <a-tab-pane :key="index2" :tab="chart.head.name" style="margin-top:10px;">
          <group-auto-chart :propsChartData="chart" :key="index2" ></group-auto-chart>
        </a-tab-pane>
      </template>
    </a-tabs>
</template>

<script>
import GroupAutoChart from './GroupAutoChart'
export default {
  name: 'GroupTemplateCard',
  components: {
    GroupAutoChart
  },
  props: ['group'],
  data() {
    return {

    }
  },
  methods: {
    handleMenuClick(code) {
      this.$router.push({ path: '/online/cggraphreport/chart/' + code })
    }
  }
}
</script>
<style scoped>

</style>
